@import "./value.scss";

//字体
@mixin font-size($size) {
    font-size: $size;
}

//背景
@mixin bg-color($bg) {
    // background-color: $bg !important;

    // 左边导航栏选中字体颜色
    // .el-menu-item.is-active span {
    //     color: $active-theme !important;
    // }

    // 左边导航栏选中图标颜色
    // .el-menu-item.is-active i {
    //     color: $active-theme !important;
    // }

    [current-theme="theme1"] & {
        background-color: $bg-ming-theme1  !important;

        .el-menu-item {
            color: $font-color-ming-theme1  !important;

            .is-active {
                color: $active-theme1  !important;
            }
        }

        .is-active {
            background-color: $select-bg-ming-theme1  !important;
            color: $active-theme1  !important;
        }

        .el-sub-menu__title {
            background-color: $bg-ming-theme1  !important;
            color: $font-color-ming-theme1  !important;
        }

        .el-menu-item-group {
            background-color: $bg-ming-theme1  !important;
        }
    }

    [current-theme="theme2"] & {
        background-color: $bg-ming-theme2  !important;

        .el-menu-item {
            color: $font-color-ming-theme2  !important;
            background-color: $bg-ming-theme2  !important;

            .is-active {
                background-color: $select-bg-ming-theme2  !important;
                color: $active-theme2  !important;
            }
        }

        .is-active {
            background-color: $select-bg-ming-theme2  !important;
            color: $active-theme2  !important;
        }

        .el-sub-menu__title {
            background-color: $bg-ming-theme2  !important;
            color: $font-color-ming-theme2  !important;
        }

        .el-menu-item-group {
            background-color: $bg-ming-theme2  !important;
        }
    }

    [current-theme="theme3"] & {
        background-color: $bg-ming-theme3  !important;

        .el-menu-item {
            color: $font-color-ming-theme3  !important;
            background-color: $bg-ming-theme3  !important;

            .is-active {
                background-color: $select-bg-ming-theme3  !important;
                color: $active-theme3  !important;
            }
        }

        .is-active {
            background-color: $select-bg-ming-theme3  !important;
            color: $active-theme3  !important;
        }

        .el-sub-menu__title {
            background-color: $bg-ming-theme3  !important;
            color: $font-color-ming-theme3  !important;
        }

        .el-menu-item-group {
            background-color: $bg-ming-theme3  !important;
        }
    }

    [current-theme="theme4"] & {
        background-color: $bg-ming-theme4  !important;

        .el-menu-item {
            color: $font-color-ming-theme4  !important;
            background-color: $bg-ming-theme4  !important;

            .is-active {
                background-color: $select-bg-ming-theme4  !important;
                color: $active-theme4  !important;
            }
        }

        .is-active {
            background-color: $select-bg-ming-theme4  !important;
            color: $active-theme4  !important;
        }

        .el-sub-menu__title {
            background-color: $bg-ming-theme4  !important;
            color: $font-color-ming-theme4  !important;
        }

        .el-menu-item-group {
            background-color: $bg-ming-theme4  !important;
        }
    }
}

//字体
// @mixin font-color($color) {
//     color: $color;

//     [current-theme="theme1"] & {
//         color: $active-theme1;
//     }

//     [current-theme="theme2"] & {
//         color: $active-theme2;
//     }

//     [current-theme="theme3"] & {
//         color: $active-theme3;
//     }

//     [current-theme="theme4"] & {
//         color: $active-theme4;
//     }

// }